import Vue from "vue";
import App from "./App.vue";

Vue.config.productionTip = false;

const nowRole = "jiangshi"

Vue.directive("role", {
  bind() {
    console.log("初始化指令的时候执行");
  },
  inserted(el, binding) {
    console.log("被绑定元素插入父节点时调用");
    if (!binding.value.includes(nowRole)) {
      console.log(el, "1111");
      //js的remove删除方法是需要内部调用当前被删除元素的父节点的,所以必须把逻辑写在inserted钩子中才可以
      el.remove();
    }
  },
  update() {
    console.log("所在组件的VNode 更新调用时,但是可以发生在其VNode更新之前");
  },
  componentUpdated() {
    console.log("指令所在组件的VNode及其VNode全部更新之后");
  },
  unbind() {
    console.log("只调用一次,指令与元素解绑时调用");
  },
});

new Vue({
  render: (h) => h(App),
}).$mount("#app");
